import {Color,CanvasTexture,Vector3} from 'three';

//generate default background texture
//#region
let defaultBgTexture;
const makeBackgroundTexture=()=> {
	if(!defaultBgTexture) {
		const ctx = document.createElement('canvas').getContext('2d');
		ctx.canvas.width = 1;
		ctx.canvas.height = 1;
		ctx.fillStyle = '#ffffff';
		ctx.fillRect(0, 0, 1, 1);
		defaultBgTexture = new CanvasTexture(ctx.canvas);
		defaultBgTexture.isDefault = true;
	}
	return defaultBgTexture;
};
//#endregion

const UIConstant = {
    //.........................................ui types/names................................................
    //#region
    TYPE_COMPONENT_CONTAINER:1000,
    TYPE_COMPONENT_BOX: 1001,
    TYPE_COMPONENT_MESH: 1002,
    TYPE_COMPONENT_INLINEL:1003,

    TYPE_BLOCK:2001,
    TYPE_INLINE_BLOCK:2002,
    TYPE_TEXT:2003,

    NAME_COMPONENT_FRAME:'ui-frame',
    //#endregion

    //.........................................style keys.............................................
    //#region
    STYLE_CONTENT: 'content',
    STYLE_SCALE_RATIO: 'pixelRatio',
    STYLE_FONT_SIZE: 'fontSize',
    STYLE_FONT_WEIGHT:'fontWeight',
    STYLE_TEXT_BASE_LINE: 'textBaseLine',
    STYLE_LINE_SPACE: 'lineSpace',
    STYLE_FONT_KERNING: 'fontKerning',
    STYLE_BREAK_ON: 'breakOn',
    STYLE_BREAK_LINE:'breakLine',
    STYLE_PLACEHOLDER:'placeholder',
    STYLE_WHITE_SPACE: 'whiteSpace',
    STYLE_BEST_FIT: 'bestFit',
    STYLE_WIDTH:'width',
    STYLE_HEIGHT:'height',
    STYLE_PADDING:'padding',
    STYLE_LETTER_SPACING:'letterSpacing',
    STYLE_INTER_LINE:'interLine',
    STYLE_MARGIN:'margin',
    STYLE_CONTENT_DIRECTION:'contentDirection',
    STYLE_JUSTIFY_CONTENT:'justifyContent',
    STYLE_ALIGN_CONTENT:'alignContent',
    STYLE_TEXT_TYPE:'textType',
    STYLE_SRC:'src',
    STYLE_FONT_FAMILY:'fontFamily',
    STYLE_FONT_TEXTURE:'fontTexture',
    STYLE_FONT_COLOR:'fontColor',
    STYLE_FONT_OPACITY:'fontOpacity',
    STYLE_FONT_SUPERSAMPLING:'fontSupersampling',
    STYLE_OFFSET:'offset',
    STYLE_BACKGROUND_COLOR:'backgroundColor',
    STYLE_BACKGROUND_WHITE_COLOR:'backgroundWhiteColor',
    STYLE_BACKGROUND_OPACITY:'backgroundOpacity',
    STYLE_BACKGROUND_TEXTURE:'backgroundTexture',
    STYLE_BACKGROUND_SIZE:'backgroundSize',
    STYLE_BACKGROUND_OPAQUE_OPACITY:'backgroundOpaqueOpacity',
    STYLE_BORDER_RADIUS:'borderRadius',
    STYLE_BORDER_WIDTH:'borderWidth',
    STYLE_BORDER_COLOR:'borderColor',
    STYLE_BORDER_OPACITY:'borderOpacity',
    STYLE_HIDDEN_OVERFLOW:'hiddenOverflow',
    STYLE_FONT_PX_RANGE:'fontPXRange',
    //#endregion

    //...........................................values.................................................
    //#region
    VALUE_NONE:'none',
    VALUE_NORMAL:'normal',
    VALUE_PRE_LINE:'pre-line',
    VALUE_PRE_WRAP:'pre-wrap',
    VALUE_MANDATORY:'mandatory',
    VALUE_POSSIBLE:'possible',
    VALUE_COLUMN:'column',
    VALUE_COLUMN_REVERSE:'column-reverse',
    VALUE_ROW:'row',
    VALUE_ROW_REVERSE:'row-reverse',
    VALUE_LEFT:'left',
    VALUE_RIGHT:'right',
    VALUE_TOP:'top',
    VALUE_BOTTOM:'bottom',
    VALUE_CENTER:'center',
    VALUE_START:'start',
    VALUE_END:'end',
    VALUE_COVER:'cover',
    VALUE_STRETCH:'stretch',
    VALUE_CONTAIN:'contain',
    VALUE_GROW:'grow',
    VALUE_SHRINK:'shrink',
    VALUE_AUTO:'auto',
    VALUE_MIDDLE:'middle',
    VALUE_ALPHABETIC:'alphabetic',
    VALUE_HANGING:'hanging',
    VALUE_BOLD:'bold',
    //#endregion

    LAYOUT_RELATIVE:'relative',
    LAYOUT_ABSOLUTE:'absolute',

};

UIConstant.DEFAULT={
    //default value
    CONTAINER: null,
    UI_OFFSET:new Vector3(0,0,-1),

    //default style
	[UIConstant.STYLE_SCALE_RATIO]: 1/48,
	[UIConstant.STYLE_FONT_FAMILY]: 'YaHei',
    [UIConstant.STYLE_FONT_SIZE]: 24,
    [UIConstant.STYLE_FONT_WEIGHT]: UIConstant.VALUE_NORMAL,
    [UIConstant.STYLE_TEXT_BASE_LINE]: UIConstant.VALUE_MIDDLE,
    [UIConstant.STYLE_LINE_SPACE]: 4,
    [UIConstant.STYLE_FONT_KERNING]: 2,
    [UIConstant.STYLE_LETTER_SPACING]: 1, 
    [UIConstant.STYLE_BEST_FIT]: UIConstant.VALUE_NONE,
	[UIConstant.STYLE_OFFSET]: 0.01,
	[UIConstant.STYLE_INTER_LINE]: 0.01,
    [UIConstant.STYLE_BREAK_ON]: '，。：；？！,.:;?!\n',
    [UIConstant.STYLE_BREAK_LINE]:'\n',
    [UIConstant.STYLE_PLACEHOLDER]:'\t',
    [UIConstant.STYLE_WHITE_SPACE]: UIConstant.VALUE_PRE_LINE,
	[UIConstant.STYLE_CONTENT_DIRECTION]: UIConstant.VALUE_COLUMN,
	[UIConstant.STYLE_ALIGN_CONTENT]: UIConstant.VALUE_CENTER,
	[UIConstant.STYLE_JUSTIFY_CONTENT]: UIConstant.VALUE_START,
	[UIConstant.STYLE_FONT_TEXTURE]: null,
	[UIConstant.STYLE_TEXT_TYPE]: "MSDF",
	[UIConstant.STYLE_FONT_COLOR]: new Color( 0xffffff ),
	[UIConstant.STYLE_FONT_OPACITY]: 1,
	[UIConstant.STYLE_FONT_PX_RANGE]: 4,
	[UIConstant.STYLE_FONT_SUPERSAMPLING]: true,
	[UIConstant.STYLE_BORDER_RADIUS]: 0.01,
	[UIConstant.STYLE_BORDER_WIDTH]: 0,
	[UIConstant.STYLE_BORDER_OPACITY]: 0,
	[UIConstant.STYLE_BORDER_COLOR]: new Color( 'black' ),
	[UIConstant.STYLE_BACKGROUND_SIZE]: UIConstant.VALUE_COVER,
	[UIConstant.STYLE_BACKGROUND_COLOR]: new Color( 0x222222 ),
	[UIConstant.STYLE_BACKGROUND_WHITE_COLOR]: new Color( 0xffffff ),
	[UIConstant.STYLE_BACKGROUND_OPACITY]: 0.8,
	[UIConstant.STYLE_BACKGROUND_OPAQUE_OPACITY]: 1.0,
	[UIConstant.STYLE_BACKGROUND_TEXTURE]: makeBackgroundTexture,
	[UIConstant.STYLE_HIDDEN_OVERFLOW]: false,

};

export default UIConstant;